<!doctype html>
<html>
  <head>
    <title>Moderator UI API Utilities</title>
    <script src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"></script>
  </head>
<body>
  <h2>UI to API URL Converter</h2>
  <table>
    <tr>
      <td colspan="2">
        This tool converts the URLs from the Google Moderator UI into decimal values you can use in the API.
      </td>
    </tr>
    <tr>
      <td>Google Moderator URL:</td>
      <td><input id="url" value="http://www.google.com/moderator/#15/e=1d33&t=1d33.40&f=1d33.1efe4" size="90"/></td>
    </tr>
  </table>

  <table>
    <tr><td>Series:</td><td><input id="series" readonly/></td></tr>
    <tr><td>Topic:</td><td><input id="topic" readonly/></td></tr>
    <tr><td>Featured Submission:</td><td><input id="featured" readonly/></td></tr>
    <tr><td>Examples:</td><td id="examples"></td></tr>
  </table>

  <script>
    function makeLink(url) {
      return $("<a>").attr("href", url).text(url);
    }

    function changed() {
      $("#series").empty();
      $("#topic").empty();
      $("#featured").empty();
      $("#examples").empty();

      var fragment = /.*#(.*)/.exec($("#url").attr("value"));
      if (!fragment) {
        return;
      }
      fragment = fragment[1];

      var series = parseInt(/e=([a-f0-9]+)/.exec(fragment)[1], 16);
      $("#series").attr("value", series);

      var series_topic_r = /t=([a-f0-9]+)[.]([a-f0-9]+)/.exec(fragment);
      var series_topic_series = parseInt(series_topic_r[1], 16);
      if (series_topic_series != series) {
        $("#series").attr("value", $("#series").attr("value") + " or " + series_topic_series);
      }
      var series_topic_topic = parseInt(series_topic_r[2], 16);
      $("#topic").attr("value", series_topic_topic);

      var featured_r = /f=([a-f0-9]+)[.]([a-f0-9]+)/.exec(fragment);
      var featured_series;
      var featured_submission;
      if (featured_r) {
        featured_series = parseInt(featured_r[1], 16);
        if (featured_series != series && featured_series != series_topic_series) {
          $("#series").attr("value", $("#series").attr("value") + " or " + featured_series);
        }
        featured_submission = parseInt(featured_r[2], 16);
        $("#featured").attr("value", featured_submission);
      }

      if (series) {
        var url = "http://www.googleapis.com/moderator/v1/series/" + series;
        $("#examples").append("<br>series.Get: ").append(makeLink(url));
      }
      if (series_topic_topic) {
        var url = "http://www.googleapis.com/moderator/v1/series/" + series + "/topics/" + series_topic_topic;
        $("#examples").append("<br>topics.Get: ").append(makeLink(url));
        var url2 = "http://www.googleapis.com/moderator/v1/series/" + series + "/topics/" + series_topic_topic + "/submissions";
        $("#examples").append("<br>submissions.List: ").append(makeLink(url2));
      }
      if (featured_series && featured_submission) {
        var url = "http://www.googleapis.com/moderator/v1/series/" + featured_series + "/submissions/" + featured_submission;
        $("#examples").append("<br>submissions.Get: ").append(makeLink(url));
      }
    }

    function start() {
      $('#url').bind('change keyup', changed);
      $('#url').trigger('change');
      $('#url').bind('click', function() { this.focus(); this.select(); });
    }

    $(start);
  </script>

</body>
</html>
